<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core"  prefix="c"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>欢迎光临 Music Store</title>
<link type="text/css" rel="Stylesheet" href="style/front.css" />
<style>
#hotAlbums dd{padding-top:10px;}
#hotAlbums dl{margin:5px 0px;}
#hotAlbums hr{clear:both;margin-top:10px;}
</style>
</head>
<body>
	<div id="wrapper">
		<div id="header">
			<div id="header-logo">
				<a href="index.jsp"><img src="style/images/logo.png" alt=""></img>
				</a>
			</div>
			<div id="header-login">
				<a href="#">登录</a> | <a href="#">注册</a>
			</div>
			<div class="clearBoth"></div>
			<div id="header-search">
				<form action="inquire.jsp" method="get">
				<input id="keyword" type="text" name="title"/><input id="btnSearch"
					type="submit" value="搜索" />
				</form>
			</div>
			<div id="header-nav">
				<ul>
					<li><a href="#">首页</a>
					</li>
					<li><a href="#">商店</a>
					</li>
					<li><a href="#">购物车</a>
					</li>
					<li><a href="#">个人信息</a>
					</li>
				</ul>
				<label id="welcome">您好，Sam。</label>
			</div>
		</div>
		<div id="content">
			<div id="sidebar">
				<h3>唱片分类</h3>
				<ul class="categories">
					<c:forEach items="${genre }" var="g" varStatus="vs">
					<c:if test="${vs.index%2==0}">
					<li><a href="InquireServlet?gid=${g.id }">${g.name }</a>
					</li>
					</c:if>
					<c:if test="${vs.index%2!=0 }">
					<li><a href="InquireServlet?gid=${g.id }" class="even">${g.name }</a>					</li>
					</c:if>
					</c:forEach>
				</ul>
			</div>
			<div id="main">
				<h3 id="main-title">唱片列表</h3>
				<div id="hotAlbums">						
						<c:forEach items="${album }" var="a">
						<dl style="clear:both;margin-top:10px;">
							<dt style="float:left;padding-right:10px;width:240px;
							height:280px;"><img src="CoverImages/${a.id }.jpg" /></dt>
							<dd style="color:blue;font-size:15px;font-weight:bold;">${a.title }</dd>
							<dd><strong>歌手:</strong>${a.artist }&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<strong>定价:</strong>${a.price }</dd>
							<dd>${a.description }</dd>
							</dl>
						</c:forEach>
						 <hr/>
					<c:if test="${param.pageNum>1 }">
					<a href="InquireServlet?page=${param.pageNum-1 }&gid=${param.gid }&title=${param.title}">上一页</a>
					</c:if>
					<c:if test="${pageNum < totalPage }">
					<a href="InquireServlet?page=${param.pageNum+1 }&gid=${param.gid }&title=${param.title}">下一页</a>
					</c:if>
					| 共${param.totalPage }页,第${param.pageNum }页
				</div>
			</div>
			<div class="clearBoth"></div>
		</div>
		<div id="footer">
			<div id="footer-ad">
				<img src="style/images/footer.png" alt=""></img>
			</div>
			<div id="footer-contactUs">
				<p>Music Store</p>
				<p>Design by Sam Chen, July,2011.</p>
			</div>
		</div>
	</div>
</body>
</html>

